import React, {Component,memo} from 'react';
import Header from "./Header";
import Main from "./Main";


const Footer = memo(function () {
    console.log("Footer render")
    return (
        <div>
            footer
        </div>
    );
});

class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            message: "hello world"
        }
    }

    render() {
        console.log("App render")
        const {message} = this.state

        return (
            <div>
                <h2>{message}</h2>
                <button onClick={event => {
                    this.setState({message: "hello react"})
                }}>changeMes
                </button>
                <Header/>
                <Main/>
                <Footer/>
            </div>
        );
    }
}

export default App;